<template>
  <div>
    <public-header-2></public-header-2>
    <div id="bodyMsg">
      <el-row>
        <el-col :span="8">
          <div id="left">
            <p>订单将在2小时后关闭，请及时付款</p>
            <img
              style="margin-top: 20px; margin-bottom: 20px"
              src="/images/wxPay.jpg"
              width="211"
            />
            <p>请使用微信扫一扫完成支付</p>
          </div>
        </el-col>
        <el-col :span="16">
          <div id="right">
            <p>大麦网订单</p>
            <p>支付订单号：57921830218038120833</p>
            <p>商品名称：发骄傲的拉升角度来看</p>
            <p>订单金额：¥ <span>84.71</span></p>
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import publicHeader2 from "../components/publicHeader2.vue";
export default {
  name: "wxPay",
  components: {
    publicHeader2,
  },
};
</script>

<style scoped>
#bodyMsg {
  width: 80%;

  margin: 0 auto;
  /* border: 1px solid red; */
  background-color: white;
  margin-top: 20px;
  padding: 15px;
  height: 400px;
}
.el-col {
  /* border: 1px solid red; */
  height: 400px;
}
#left {
  position: relative;
  top: 50px;
}
#right {
  position: relative;
  top: 30px;
  text-align: left;
}
#right p {
  margin-top: 20px;
  text-indent: 2rem;
}
#right p span {
  color: #ff4627;
}
</style>